<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理</title>
    <#assign base=request.contextPath/>
    <#setting  number_format="0.##"/>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${base}/backstage/layui/css/layui.css" media="all">
    <script src="${base}/backstage/layui/layui.js?t=1"></script>
    <script src="${base}/backstage/js/jquery-1.8.3.min.js?t=1"></script>
    <script src="${base}/backstage/js/feng.js?t=1"></script>
    <style>
        /*给数据表格加高*/
        .layui-table-cell{
            height:100%;
        }
        /*.layui-table tbody tr:hover {*/
        /*    background-color: #f0ad4e;*/
        /*}*/
    </style>
</head>
<body>
<br>
<div class="demoTable" style="margin-left: 60px;">
    <form class="layui-form " action="">
        <div class="layui-form-item">

            <div class="layui-inline">
                <label>商家名称</label>
                <div class="layui-inline">
                    <input class="layui-input" name="nameOfMerchant" placeholder="请输入商家名称" id="nameOfMerchant" autocomplete="off">
                </div>
            </div>
            <div class="layui-inline">
                <label>商家联系人</label>
                <div class="layui-inline">
                    <input class="layui-input" name="merchantContact" placeholder="请输入商家联系人" id="merchantContact" autocomplete="off">
                </div>
            </div>
            <div class="layui-inline">
                <label>账户</label>
                <div class="layui-inline">
                    <input class="layui-input" name="account" placeholder="请输入账户" id="account" autocomplete="off">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">请选择状态</label>
                <div class="layui-input-inline">
                    <select name="state" id="state" lay-verify="required" lay-search="">
                        <option value="">请选择审核状态</option>
                        <option value="1">未审核</option>
                        <option value="2">审核通过</option>
                        <option value="3">审核失败</option>
                    </select>
                </div>
            </div>
            <button class="layui-btn" onclick="sech()" data-method="offset"
                    type="button">查询
            </button>
        </div>
    </form>
</div>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="switchTpl">

    {{#  if(d.charge == 1){ }}
    <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" checked="checked" lay-text="是|否" lay-filter="sexDemo">
    {{#  } else { }}
    <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch"  lay-text="是|否" lay-filter="sexDemo">
    {{#  } }}


</script>
<script type="text/html" id="barDemo">
    {{#  if(d.orderState == 1){ }}
    <button class="layui-btn" onclick="zfbPay('{{d.id}}')" style="background: #f0ad4e;color: #FFFFFF">未支付</button>
    {{#  } else { }}
    <button class="layui-btn"  style="background: #f0ad4e;color: #FFFFFF">已支付</button>
    {{#  } }}


    {{#  if(d.state == 2 || d.state == 3){ }}
    <button class="layui-btn">已审核</button>
    <button class="layui-btn" lay-event="del" onclick="onDelete('{{d.id}}')" style="background: red;color: #FFFFFF">删除</button>
    {{#  } else { }}
    <button class="layui-btn" onclick="examine('{{d.id}}')">未审核</button>
    <button class="layui-btn" lay-event="del" onclick="onDelete('{{d.id}}')" style="background: red;color: #FFFFFF">删除</button>
    {{#  } }}
    <button class="layui-btn" lay-event="del" onclick="show('{{d.id}}')" style="background: #DD691D;color: #FFFFFF">查看</button>




</script>
<script type="text/html" id="toolbarDemo">
    <form class="layui-form " action="">
        <div class="layui-form-item" style="margin-left: 15px;">
            <div class="layui-btn-group">
                <button class="layui-btn" id="btn2" data-method="offset" type="button">添加</button>
            </div>
        </div>
    </form>
</script>

<script>
    layui.use(['table', 'form', 'layedit', 'laydate'], function () {
        var form = layui.form
            , $ = layui.jquery
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate
            , table = layui.table;





        var whereData = {}
        whereData.account = $("#account").val();
        whereData.nameOfMerchant = $("#nameOfMerchant").val();
        whereData.merchantContact = $("#merchantContact").val();
        whereData.state = $("#state").val();

        table.render({
            skin: 'line' //行边框风格
            , even: true //开启隔行背景
            , elem: '#test'
            ,where:whereData
            , url: '${base}/user/selectMyPage'
            , toolbar: '#toolbarDemo'
            ,cols:[[
                {field:'id', title: '序号',templet:function(val){
                        return val.LAY_INDEX
                    },align:'center'},
                {field:'nameOfMerchant', title: '商家名称', align:'center'},
                {field:'merchantContact', title: '商家联系人', align:'center'},
                // {field:'idNumber', title: '身份证号', align:'center'},
                {field:'phone', title: '联系电话', align:'center'},
                {field:'address', title: '商家地址',width:220, align:'center'},
                // {field:'url', title: '营业执照',templet:function(val){
                //         return "<img src="+val.url+">";
                //     }, align:'center'},

                // {field:'account', title: '账户', align:'center'},
                // {field:'passWord', title: '密码', align:'center'},
                {field:'settlementFee', title: '入驻费', align:'center'},

                {field:'state', title: '审核状态', templet:function(val){
                        if(val.state==undefined){
                            return "";
                        };
                        if(val.state==1){
                            return "<div style='background: red;color: #FFFFFF'>未审核</div>";
                        };
                        if(val.state==2){
                            return "<div style='background: green;color: #FFFFFF'>审核通过</div>";
                        };
                    }, align:'center'},

                {field:'orderState', title: '支付状态',templet:function(val){
                        if(val.orderState==undefined){
                            return "";
                        };
                        if(val.orderState==1){
                            return "<div style='background: red;color: #FFFFFF'>未支付</div>";
                        };
                        if(val.orderState==2){
                            return "<div style='background: green;color: #FFFFFF'>已支付</div>";
                        };
                    }, align:'center'},


                {field:'', title: '是否收费', templet: '#switchTpl', align:'center'},

                {field:'createTime', title: '创建时间',width:165,templet:function(val){
                        if(val.createTime==undefined){
                            return "";
                        }
                        return changeDateFormat(val.createTime);
                    },  align:'center'},
                {field: 'right', title: '操作',width:360,toolbar: '#barDemo', align: 'center'}
            ]]
            , id: 'testReload'
            , page: {
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                , theme: '#1AB394'
                , limit: 10
            }
        });

        //添加
        var active = {
            offset: function (othis) {
                var type = othis.data('type')
                    , text = othis.text();
                window.location.href = '${base}/user/user_add.html';
            }
        };
        $('#btn2').on('click', function () {
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });

        //编辑弹出层
        table.on('tool(test)', function (obj) {
            var layEvent = obj.event;
            if (layEvent == "edit") {
                var data = obj.data;
                window.location.href = '${base}/user/user_edit.html?id=' + data.id;
            }
        });

        //监听指定开关
        form.on('switch(sexDemo)', function(data){
            //开关等于true就是收费 否则就是不收费
            if(this.checked==true){
                var jsonDate = {
                    id:this.value,
                    charge:1
                }
                $.ajax({
                    type: "POST",
                    contentType: "application/json;charset=UTF-8",
                    url: "${base}/user/updateState",
                    data: JSON.stringify(jsonDate),
                    success: function (data) {
                        if (data.code === 200) {
                            layer.msg(data.msg)
                        } else {
                            layer.msg(data.msg)
                        }
                    }
                });
            }else{
                var jsonDate = {
                    id:this.value,
                    charge:2
                }
                $.ajax({
                    type: "POST",
                    contentType: "application/json;charset=UTF-8",
                    url: "${base}/user/updateState",
                    data: JSON.stringify(jsonDate),
                    success: function (data) {
                        if (data.code === 200) {
                            layer.msg(data.msg)
                        } else {
                            layer.msg(data.msg)
                        }
                    }
                });
            }

        });


    })

    //审核
    function examine(id) {
        window.location.href = "${base}/user/examine.html?id="+id
    }
    //审核
    function show(id) {
        window.location.href = "${base}/user/show.html?id="+id
    }
    //支付宝支付
    function zfbPay(id) {
        <#--window.open("${base}/user/zfbPay?id="+id)-->
        window.location.href ="${base}/user/zfbPay?id="+id
    }
    //删除
    function onDelete(id) {
        layer.confirm('真的要删除吗?', function (index) {
            $.ajax({
                type: "POST",
                url: "${base}/user/deleteById",
                data: {id: id},
                success: function (data) {
                    if (data.code === 200) {
                        layer.msg(data.msg)
                        setTimeout(function () {
                            window.location.reload();
                        }, 500)
                    } else {
                        layer.msg(data.msg)
                    }

                }
            });
        });
    }
    //搜索
    function sech() {
        var whereData = {}
        whereData.account = $("#account").val();
        whereData.nameOfMerchant = $("#nameOfMerchant").val();
        whereData.merchantContact = $("#merchantContact").val();
        whereData.state = $("#state").val();
        //表刷新方法
        var table = layui.table;
        table.reload('testReload', {
            url: '${base}/user/selectMyPage'
            , where: whereData
        });
    }
</script>

</body>
</html>